@charset "UTF-8";
body {
  background-color: #f4f4f4;
}
.nav {
  width: 100%;
  background-color: #ccc;
}
.nav ul {
  display: flex;
  display: -webkit-flex;
  justify-content: space-between;
  -webkit-justify-content: space-between;
}
.nav ul li {
  float: left;
  height: 100px;
  line-height: 100px;
  /** &.is-active {
				background-color: yellow!important;
			} */
}
.nav ul li a {
  float: left;
  padding: 0 50px;
  box-sizing: border-box;
  -webkit-box-sizing: border-box;
  /** &:hover {
					background-color: #fff;
				} */
}
.nav ul li.router-link-active {
  background-color: #fff;
}
.nav ul li.docClass {
  background-color: yellow;
}
.nav ul li.aboutClass {
  background-color: pink;
}
.nav ul li.userClass {
  background-color: #F99B15;
}
.myBtn input {
  display: inline-block;
  padding: 0 20px;
  box-sizing: border-box;
  -webkit-box-sizing: border-box;
  height: 42px;
  margin-right: 10px;
  outline: none;
  cursor: pointer;
}
#about ul,
#user ul {
  display: flex;
  display: -webkit-flex;
  justify-content: center;
  -webkit-justify-content: center;
  margin-top: 50px;
  background-color: #dcdcdc;
}
#about ul li,
#user ul li {
  float: left;
  height: 80px;
  line-height: 80px;
}
#about ul li a,
#user ul li a {
  float: left;
  padding: 0 50px;
  box-sizing: border-box;
  -webkit-box-sizing: border-box;
}
#about ul li.router-link-active,
#user ul li.router-link-active {
  background-color: gray;
}
#about .aboutAlign,
#user .aboutAlign {
  margin-top: 50px;
}
#user ul {
  background-color: #dbdbdb!important;
}
#user ul li.router-link-active {
  background-color: burlywood!important;
}
#user .userInfo p {
  font-size: 30px;
  line-height: 50px;
}
#user .infoCont {
  font-size: 20px;
  margin-top: 20px;
}
#user .infoCont a {
  padding: 0 10px;
  box-sizing: border-box;
  -webkit-box-sizing: border-box;
}
#user .infoCont a.router-link-active {
  background-color: yellowgreen!important;
}
#user .infoCont .infoShow {
  font-size: 20px;
  margin-top: 20px;
}
